<template>
    <view v-if="type==1" class="bg-[#f8f8f8] min-h-screen">
        <view class="h-[1rpx]"></view>
      
        <view class="mt-[10rpx] px-[40rpx] text-[30rpx] font-medium bg-white pb-[60rpx]">
            <view class="py-[18rpx] flex items-center ">
                <text>班级ID：</text>
                <text class="ml-[30rpx]">2236585</text>
            </view>
            <view class="py-[18rpx] flex items-center ">
                <text>班级名称：</text>
                <text class="ml-[30rpx]">2024级书法班</text>
            </view> 
            <view class="py-[18rpx] flex items-center ">
                <text>班级封面:</text>
                <text class="ml-[30rpx]"></text>
            </view> 
            <view class="py-[18rpx] flex items-center ">
                <text>班级简介:</text>
                <text class="ml-[30rpx]"></text>
            </view> 
            <view class="py-[18rpx] flex items-center ">
                <text>班级类型:</text>
                <text class="ml-[30rpx]">自建班级</text>
            </view> 
            <view class="py-[18rpx] flex items-center ">
                <text>班级管理员:</text>
                <text class="ml-[30rpx]">创始人（自己）</text>
            </view> 
            
            <view class="py-[18rpx] flex items-center  w-full">
                <text class="flex-1">班级二维码:</text>

                <image class="w-[53rpx] h-[53rpx]"
                    src="">
                </image>
                <u-icon name="arrow-right" color="#575B66" size="16"></u-icon>
            </view>

         

        </view>
        <view class="mt-[20rpx] text-center text-[30rpx] bg-white pt-[20rpx] pb-[40rpx]">
                <view>2024级书法班</view>
                <view class="mt-[20rpx]">邀请您加入班级</view>
                <view class="mt-[204rpx] flex items-center justify-center">
                <view class=" mr-[80rpx] text-[#FD755D] py-[20rpx] px-[50rpx] bg-[#ffd6cf] rounded  text-[32rpx]">拒绝</view>
                <view class=" text-white py-[20rpx] px-[50rpx] bg-[#FD755D] rounded  text-[32rpx]">同意</view>
            </view>
            </view>
    </view>


    <view v-if="type==2" class="bg-[#f8f8f8] min-h-screen">
        <view class="h-[1rpx]"></view>
        <view class="m-[20rpx] ">
            <view class="mx-[16rpx]"> <u-search disabled bgColor="#fff" :showAction="false" placeholder="搜索"
                    v-model="course"></u-search></view>

           
        </view>
        <view class="bg-[#fff]">
            <view 
                class="text-[30rpx] h-[100rpx] flex items-center justify-between text-right mx-[20rpx] border-b border-[#EFEFEF]">

                <view>成员列表</view>
                <view @click="navigateTo('/pages/classManagementDetails_addMembers/classManagementDetails_addMembers')" class=" ml-[15rpx] text-[#FD755D] font-medium ">+添加成员</view>

            </view>
            <view class="border-b border-[#EFEFEF]">
                <view
                    class="h-[100rpx] flex items-center mx-[20rpx] ">


                    <view class=" ml-[15rpx]">1、张三 <text class="ml-2">15936987543</text></view>
                    <view class="ml-auto">
                        <text>详情</text>
                        
                    </view>
                </view>
                <view 
                    class="h-[100rpx] flex items-center mx-[20rpx]">


                    <view class=" ml-[15rpx]">2、李四 <text class="ml-2">15936987543</text></view>
                    <view class="ml-auto">
                        <text >详情</text>
                       
                    </view>
                </view>
                <view
                    class="h-[100rpx] flex items-center mx-[20rpx] ">


                    <view class=" ml-[15rpx]">3、王五 <text class="ml-2">15936987543</text></view>
                    <view class="ml-auto">
                        <text>详情</text>
                    </view>
                </view>
            </view>
            <view 
                class="text-[#FD755D] text-[30rpx] h-[100rpx] flex items-center justify-end text-right mx-[20rpx] border-b border-[#EFEFEF]">

               
                <view class=" ml-[15rpx]  font-medium ">查看更多成员</view>

            </view>

        </view>
        <view class="mt-[10rpx] px-[40rpx] text-[30rpx] font-medium bg-white pb-[60rpx]">
            <view class="py-[18rpx] flex items-center ">
                <text>班级ID:</text>
                <text class="ml-[30rpx]">2236585</text>
            </view>
            <view class="py-[18rpx] flex items-center ">
                <text>班级名称:</text>
                <text class="ml-[30rpx]">2024级书法班</text>
            </view> 
            <view class="py-[18rpx] flex items-center ">
                <text>班级封面:</text>
                <text class="ml-[30rpx]"></text>
            </view> 
            <view class="py-[18rpx] flex items-center ">
                <text>班级简介:</text>
                <text class="ml-[30rpx]"></text>
            </view> 
            <view class="py-[18rpx] flex items-center ">
                <text>班级类型:</text>
                <text class="ml-[30rpx]">自建班级</text>
            </view> 
            <view class="py-[18rpx] flex items-center ">
                <text>班级管理员:</text>
                <text class="ml-[30rpx]">创始人（自己）</text>
            </view> 
            
            <view class="py-[18rpx] flex items-center  w-full">
                <text class="flex-1">班级二维码:</text>

                <image class="w-[53rpx] h-[53rpx]"
                    src="">
                </image>
                <u-icon name="arrow-right" color="#575B66" size="16"></u-icon>
            </view>



        </view>
        <view class="mt-[100rpx] flex justify-center">
                <view
                    class="w-[208rpx] rounded font-medium text-[30rpx] px-1 bg-[#FD755D] text-white h-[88rpx] flex justify-center items-center">
                    退出班级</view>
            </view>
    </view>
    
</template>
<script setup>
import { ref, reactive, onMounted, onUnmounted, getCurrentInstance, watch } from 'vue'
const type = ref(1)
const navigateTo = (url) => {
    uni.navigateTo({
        url
    })
}
onLoad((option)=>{
    if(option.type){
        type.value = option.type
    }
  
})
</script>